<template>
	<el-container class="inner">
		<el-aside width="260px">
			<el-menu :default-openeds="['1', '3']">
				<el-submenu index="1">
					<template slot="title"><i class="el-icon-message"></i>组件</template>
					<el-menu-item-group>
						<el-menu-item v-for="(item,i) in menus" :key="item.key" :index="`1-${i}`"><router-link :to="{'name':item.key}">{{item.key}} {{item.label}}</router-link></el-menu-item>
					</el-menu-item-group>
					
				</el-submenu>
			</el-menu>
		</el-aside>
		<el-container>
			<el-main><router-view></router-view></el-main>
		</el-container>
	</el-container>
</template>

<script>
export default {
  name: "Home",
  components: {},
  data() {
    return {
      menus: [
        {
          key: "DynamicForm",
          label: "动态表单"
        },
        {
          key: "Table",
          label: "表格"
        },
        {
          key: "Pagination",
          label: "分页"
        },
        {
          key: "Rate",
          label: "评分"
        },
        {
          key: "Upload",
          label: "上传"
        },
        {
          key: "Message",
          label: "消息提示"
        },
        {
          key: "MessageBox",
          label: "弹窗"
        },
        {
          key: "Modal",
          label: "模态框"
        },
        {
          key: "Checkbox",
          label: "多选"
        },
        {
          key: "Dates",
          label: "时间"
        }
      ]
    };
  },
  created: function() {},
  mounted: function() {
    this.$nextTick(function() {});
  },
  methods: {}
};
</script>
